<a href="http://www.100sucai.com" style="display:none">http://www.100sucai.com</a>
<!doctype html>
<html>
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>jQuery dm_notify.js Plugin Demos</title>
    <link rel="stylesheet" href="bootstrap.min.css">
    <link href="dm-notif-style.css" rel="stylesheet" type="text/css">
    <style>
        body {
            font-family: 'roboto';
            background-color: #434A53;
            color: #fff;
        }
    </style>
</head>

<body>
<div id="dm-notif"></div>
<div class="container" style="margin-top:150px; text-align:center">
    <h1>jQuery dm_notify.js Plugin Demos</h1>
    <div style="margin:20px auto; text-align:center">
        <a href="http://www.100sucai.com/"><img src="100sucai.png"/></a>
    </div>
    <a class="btn btn-danger" id="red"><span>Error Message</span></a>
    <a class="btn btn-success" id="green"><span>Success Message</span></a>
    <a class="btn btn-info" id="blue"><span>Info Message</span></a>
    <a class="btn btn-warning" id="yellow"><span>Warning Message</span></a>
    <a class="btn btn-primary" id="orange"><span>Extra Message</span></a>
</div>

<script src="jquery-1.11.3.min.js"></script>
<script src="dm_notify.js"></script>
<script>
    $(document).ready(function (e) {
        $('#red').on('click', function () {
            dm_notification('Lorem ipsum dolor sit amet, consectetur adipiscing elit!', 'red', 3000)
        });
        $('#green').on('click', function () {
            dm_notification('Pellentesque eu tincidunt leo. Curabitur turpis justo.', 'green', 6000)
        });
        $('#blue').on('click', function () {
            dm_notification('Aliquam erat volutpat. Cras sit amet condimentum risus. ', 'blue', 4000)
        });
        $('#yellow').on('click', function () {
            dm_notification('Donec vitae gravida nunc.', 'yellow', 3000)
        });
        $('#orange').on('click', function () {
            dm_notification('Pellentesque quis viverra quam. Nulla consectetur odio bibendum', 'orange', 5000)
        });
    });
</script>

</body>
</html>
